<template>
  <base-breadcrumb>
    <a-spin :spinning="tableLoading">
      <a-card>
        <titleName title="基本信息"></titleName>
        <a-form-model ref="ruleForm" :model="form" :rules="rules" :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
          :wrapperCol="{ lg: { span: 16 }, sm: { span: 16 } }">
          <a-row :gutter="24">

            <a-col span="16">
              <a-form-model-item label="所属单位" prop="projectId">
                <org-tree-select v-model="form.projectId" isAutoSelectFirst checkStrictly disabled
                @getProjectInfo = 'getProjectInfo'
                  @select="selectOrg"></org-tree-select>

              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="商务组织设计规划完成时间：" prop="finishedDate">
                <a-date-picker :disabled="pageType == 'looks'" v-model="form.finishedDate"
                  @change="(date, dateString) => getTime(date, dateString, 'form', 'finishedDate')" />
                <!-- <a-input  v-model="form.bidDate" :disabled="pageType == 'looks'" /> -->
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="预计总收入(不含税)（元）：" prop="expectedTotalAmount">
                <a-input-number :precision="2" v-model="form.expectedTotalAmount" :disabled="pageType == 'looks'" @change="handlechange
                "/>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="预计总成本(不含税)（元）：" prop="expectedTotalCost">
                <a-input-number :precision="2" v-model="form.expectedTotalCost" :disabled="pageType == 'looks'" @change="handlechange" />
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="预计效益额(不含税)（元）：" prop="expectedBenefit">
                <a-input-number :precision="2" v-model="form.expectedBenefit" disabled/>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="预计效益率（%）：" prop="expectedBenefitRate">
                <a-input-number v-model="form.expectedBenefitRate" disabled/>
              </a-form-model-item>
            </a-col>
<!--            <a-col :md="8" :sm="8">-->
<!--              <a-form-model-item label="优化效益额(不含税)（元）：：" prop="optimizeBenefit">-->
<!--                <a-input-number :precision="2" v-model="form.optimizeBenefit" :disabled="pageType == 'looks'"  @change="handlechange" />-->
<!--              </a-form-model-item>-->
<!--            </a-col>-->
<!--            <a-col :md="8" :sm="8">-->
<!--              <a-form-model-item label="优化效益率（%）：" prop="optimizeBenefitRate">-->
<!--                <a-input-number v-model="form.optimizeBenefitRate" disabled />-->
<!--              </a-form-model-item>-->
<!--            </a-col>-->
            <a-col :md="8" :sm="8">
              <a-form-model-item label="中标时间：" prop="bidDate">
                <a-date-picker disabled v-model="bidDate" />
                <!-- <a-input  v-model="form.bidDate" :disabled="pageType == 'looks'" /> -->
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="填报人" prop="informant">
                <a-input v-model="form.informant" disabled/>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="填报时间：" prop="informantTime">
                <a-date-picker disabled v-model="form.informantTime"
                  @change="(date, dateString) => getTime(date, dateString, 'form', 'informantTime')" />
                <!-- <a-input  v-model="form.informantTime" :disabled="pageType == 'looks'" /> -->
              </a-form-model-item>
            </a-col>
            <a-col :md="24" :sm="24">
              <a-form-model-item label="备注" prop="remark" :labelCol="{ lg: { span: 5 }, sm: { span: 5 } }"
                :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }">
                <!-- <BaseTextarea :auto-size="{ minRows: 3, maxRows: 5 }" v-model="form.participants" /> -->
                <a-input v-model="form.remark" type="textarea" :disabled="pageType == 'looks'" />
              </a-form-model-item>
            </a-col>
            <a-col :md="24" :sm="24">
              <a-form-model-item label="附件上传">
                <upload-list :businessCode="'BM19'" :disabled="pageType == 'looks'" :uploadArrys.sync="form.files"
                  @fileArrysData="handleFileUploaded" multiple></upload-list>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </a-card>
      <div class="tool-btns page-btn-right-top" v-if="!isAudit&&!isConsultation">

        <a-button type="primary" v-if="pageType != 'looks'" :loading="loading.SUBMITTED"
          @click="handleSave('DRAFT')">保存草稿</a-button>
        <a-button type="primary" :loading="loading.SUBMITTED" @click="handleSave('SUBMITTED')"
          v-if="pageType != 'looks'">提交</a-button>
        <a-button @click="handleClose">关闭</a-button>
      </div>
    </a-spin>
    <selectApprover :business-id="businessId" :process-config="setProcessConfig" />
  </base-breadcrumb>
</template>
<script>

import { STable } from '@/components'
import UploadList from '@/components/UploadList'
import { getBusinessPlanList, savePlanningList } from '@/api/businessAffairs/designPlanning'
import moment from 'moment'
export default {
  name: 'a' + Date.now(),
  components: {
    STable,
    UploadList,
  },
  props: {
      // 是否作为审批详情
      isAudit: {
        type: Boolean,
        default: false
      },
      // 是否作为意见征询
      isConsultation: {
        type: Boolean,
        default: false
      },
    },
  data() {
    return {
      bidDate: '',
      tableLoading: false,
      loading: {
        DELETE: false,
        DRAFT: false,
        SUBMITTED: false,
        REJECTED: false
      },
      form: {
        projectId: '',
        expectedTotalAmount: '',
        expectedTotalCost: '',
        expectedBenefit: '',
        expectedBenefitRate: '',
        // optimizeBenefit: '',
        // optimizeBenefit: '',
        // optimizeBenefitRate: '',
        bidDate: '',
        informant: '',
        informantTime: '',
        remark: ''

      },
      rules: {
        expectedTotalAmount: [{ required: true, message: '请输入' }],
        expectedTotalCost: [{ required: true, message: '请输入' }],
        // optimizeBenefit: [{ required: true, message: '请输入' }],
        finishedDate: [{ required: true, message: '请选择', change: true }]
      },
      id: '',
      pageType: '',

      //获取流程配置值
      processConfig: null,
      //点击提交发送流程配置值
      setProcessConfig: null,
      businessId: null
    }
  },


  async created() {
    this.pageType = this.$route.query.pageType
    if(this.$route.query.businessId) {
      this.pageType = 'looks'
    }
    this.getLists()
    this.processConfig = await this.$getConfigFn('comm_design_plan')
  },
  methods: {
    getProjectInfo(val) {
      this.bidDate = val.winningTime
    },
    handlechange(){
      if(this.form.expectedTotalAmount && this.form.expectedTotalCost) {
        this.form.expectedBenefit =(this.form.expectedTotalAmount * 100 - this.form.expectedTotalCost * 100)/100
        if(parseInt(this.form.expectedTotalAmount) !== 0) {
          this.form.expectedBenefitRate = (this.form.expectedBenefit / this.form.expectedTotalAmount * 100).toFixed(2)
          //this.form.optimizeBenefitRate=(this.form.optimizeBenefit / this.form.expectedTotalAmount * 100).toFixed(2)
        } 
      }

      if(!this.form.expectedTotalAmount) {
        this.form.expectedBenefitRate = ''
       // this.form.optimizeBenefit = ''
      }
     
    },
    getTime(date, dateString, type, name) {
      this[type][name] = dateString
      console.log(this[type][name])
    },
    // 获取详情
    getLists() {
      getBusinessPlanList({ id: this.$route.query.id }).then((res) => {
        if (res.code == 200) {
          const data = res.data
          this.form = data
          this.form.files = res.data.reviewFileInfoVOList
            if( this.pageType !== 'looks') {
            this.form.informant = this.$userInfo().name
            this.form.informantTime = moment().format("YYYY-MM-DD")
          }
          
        }
      })
    },

    handleFileUploaded(list) {
      this.form.files = [...list]
    },

    //获取项目id
    selectOrg(val) {
      if (val && val.length) {
        this.form.branchComId = val[val.length - 2].orgId
      }
    },

    handleClose() {
      this.$multiTab.close(this.$route.fullpath)
      // this.$router.replace("/businessAffairs/businessOrganization/businessPlan")
    },
    handleSave(auditStatus) {
      this.form.auditStatus = auditStatus
      this.form.id = this.$route.query.id
      this.form.informantUserId = this.$userInfo().id
      const cb = () => {
        this.loading.SUBMITTED=true
        //   // 提交
        savePlanningList(this.form).then(res => {
          this.loading.SUBMITTED=false
          if (res.code === 200) {

            this.$message.success('成功')
            if(auditStatus==='SUBMITTED') {
              this.businessId =this.form.id;
              this.setProcessConfig = this.processConfig;
            } else {
              this.handleClose()
            }
          } else {
            this.$message.warning('失败')
          }
        })
      }
      if (auditStatus == 'DRAFT') {
        cb()
      } else {
        if(this.form.files.length <= 0 ){
          this.$message.warning("请上传文件")
          return false
        }
        this.$refs.ruleForm.validate((valid) => {
          if (valid) {
            this.submitApprovalConfirm(this.processConfig, (flag) => {
              if (!flag) {
                this.loading.SUBMITTED=false
                return
              }
              cb()
            })
          } else {
            this.$message.warning("请填写完所有必填项信息")
            return false
          }
        })
      }
    }
  }
}
</script>
<style lang="less" scoped>
@deep: ~'>>>';

.tool-btns {
  display: flex;
  justify-content: flex-end;

  @{deep} .ant-btn+.ant-btn {
    margin-left: 12px;
  }
}
</style>
